﻿
@{
    ViewBag.Title = "管理我的网站";
    Layout = "~/Views/Shared/_Layout_Admin_Login.cshtml";
}
@section css{
    <style>
        .juzhong {
            width: 200px;
            height: 200px;
            top: 50%;
            left: 50%;
            position: absolute;
        }

        .juzhong1 {
            width: 400px;
            height: 400px;
            margin-left: -200px;
            margin-top: -200px;
            word-wrap: break-word;
        }

        .layui-elem-field legend {
            color: #009688;
        }

        .layui-field-title {
            margin: 10px 0 20px;
            border: none;
            border: 1px solid #009688;
            height: 300px;
        }

        .juzhong1 .box {
            position: relative;
            top: 40px;
        }

        .juzhong1 .layui-btn {
            float: right;
        }

        .juzhong1 img {
            display: block;
            margin-top: 10px;
            margin-bottom: 10px;
            cursor: pointer;
        }
    </style>
}
@section js{
    <script>
        layui.define(['ejq', 'ajaxforms'], function (exports) {
            var $ = layui.ajaxforms
            var imgCode = $(".box img");
            var btnSubmit = $(".layui-btn");
            var form = {
                userName: function () { return $("#userName").val() },
                password: function () { return $("#password").val() },
                code: function () { return $("#code").val() }
            };
            imgCode.click(function () {
                var src = $(this).attr("src");
                $(this).attr("src", src + 1);
            })
            btnSubmit.click(function () {
                if (form.userName() == "") {
                    layer.msg('用户名不能为空！', {
                        icon: 2
                    });
                } else if (form.password() == "") {
                    layer.msg('密码不能为空！', {
                        icon: 2
                    });
                } else if (form.code() == "") {
                    layer.msg('验证码不能为空！', {
                        icon: 2
                    });
                } else {
                    var url = $.action.url("submit", null, "Login", "AdminSite");
                    $("form").ajaxSubmit({
                        type: 'post',
                        url: url,
                        success: function (msg) {
                            if (msg.Status == "1") {
                                window.location.href = msg.ResultInfo;
                            } else {
                                layer.msg(msg.ResultInfo, {
                                    icon: 2
                                });
                            }
                        }, error: function (msg) {

                        }
                    })
                }
            });
        });
    </script>
}
<div class="juzhong">
    <!--外层div绝对定位，左上定点居中-->
    <div class="juzhong1">
        <!--内部div margin 负值纠正-->
        <fieldset class="layui-elem-field layui-field-title">
            <legend>管理CodeIsBug.com</legend>
            <div class="box">
                <form>
                    <div class="layui-form-item">
                        <label class="layui-form-label">用户名</label>
                        <div class="layui-input-inline">
                            <input type="tel" id="userName" name="userName" maxlength="50" lay-verify="phone" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">密码</label>
                        <div class="layui-input-inline">
                            <input type="tel" id="password" name="password" maxlength="50" lay-verify="phone" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">验证码</label>
                        <div class="layui-input-inline">

                            <img src="@Url.Action("OutPutVerifyCode","Home",new { Area=""})?r=" />

                            <div class="layui-input-inline" style="width: 80px;">
                                <input id="code" type="text" maxlength="30" name="code" placeholder="验证码" autocomplete="off" class="layui-input">
                            </div>
                            <button class="layui-btn">进入</button>

                        </div>
                    </div>
                </form>
            </div>
        </fieldset>

    </div>
</div>